<link rel="import" href="../../bower_components/polymer/polymer-element.html">
<link rel="import" href="../../bower_components/iron-overlay-behavior/iron-overlay-behavior.html">
<dom-module id="flat-dialog">
    <template>
        <style>
            :host {
                display: block;
                margin: 0 auto;
                background: white;
                color: black;
                padding: 24px;
                border-radius: 5px;
                width: 700px;
                min-width: 400px;
                box-shadow: rgba(0, 0, 0, 0.24) -2px 5px 12px 0px, rgba(0, 0, 0, 0.12) 0px 0px 12px 0px;
            }
        </style>
        <slot></slot>
    </template>
    <script>
        /**
         * @FlatDialog
         * @polymer
         * @extends {Polymer.Element}
         */
        class FlatDialog extends Polymer.mixinBehaviors([Polymer.IronOverlayBehavior], Polymer.Element) {
            /**
             * String providing the tag name to register the element under.
             */
            static get is() {
                return 'flat-dialog';
            }
        }
        window.customElements.define(FlatDialog.is, FlatDialog);
    </script>
</dom-module>